<template>
    <div style="display:flex;flex-direction:column;width:100%;margin-top:25px">
      <p-form-model>
        <p-row :guter="24">
          <p-col :span="8">
             <p-form-model-item ref="number" label="请选择锁定单号" prop="number">
              <p-input 
                  placeholder="请点击选择"
                  v-model="form"
                  readonly
                  @change="onChangeMaterialNo"
                  ref="userNameInput"
                  @click="openPop"
                  :disabled="disabled"
                  >
                  <p-icon slot="prefix" type="cluster" />
              </p-input>
            </p-form-model-item>
          </p-col>
        </p-row>
      </p-form-model>

        <div style="margin-bottom:10px;background:#eee;line-height:40px;padding-left:5px">产品锁定明细</div>
         <p-table
            ref="table"
            size="middle"
            bordered
            rowKey="id"
            :scroll='tableScroll'
            :columns="defColumns"
            :dataSource="dataSource"
            :pagination="ipagination"
            :loading="loading"
            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
            @change="handleTableChange">
      </p-table>
       <!-- 产品更改明明细 -->
      <changedetails></changedetails>
      <!-- 锁定单号列表 -->
      <p-modal v-model="lockNumber" title @ok="lockNumberOk" width="70%" >
        <lockNumber  @getNumber="getlist"></lockNumber>
      </p-modal>
    </div>
</template>
<script>
import changedetails from "./Changedetails";
import lockNumber from "./lockNumber";
export default {
   components: {
     changedetails,
     lockNumber
   },
    data(){
        return {
          lockNumber:false,
            // 表头
        defColumns: [
          {
            title: "序号",
            dataIndex: '',
            key:'rowIndex',
            width:60,
            align: 'center',
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          {
            title:'生产订单号',
            align: 'center',
            dataIndex: 'billNum',
          },
          {
            title:'物料编码',
            align: 'center',
            dataIndex: 'billOri',
          },
          {
            title:'物料名称',
            align: 'center',
            dataIndex: 'billOriNum',
          },
          {
            title:'序列号',
            align: 'center',
            dataIndex: 'createBy',
          },
          {
            title:'数量',
            align: 'center',
            dataIndex: 'createTime',
          },
          {
            title:'库位',
            align: 'center',
            dataIndex: 'productCodeChangeBefore',
          },
          {
            title:'类别',
            align: 'center',
            dataIndex: 'remark',
          },
        ],
        /* 分页参数 */
        ipagination: {
          current: 1,
          pageSize: 10,
          pageSizeOptions: ['10', '20', '50'],
          showTotal: (total, range) => {
            return range[0] + "-" + range[1] + " 共" + total + "条"
          },
          showQuickJumper: true,
          showSizeChanger: true,
          total: 0
        }
        }
    },
    methods:{
      openPop(){
        this.lockNumber=true
      },
      nulberListVisibleOk(){
        this.lockNumber=false
    },
    }
}
</script>